import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { RouterModule, Routes} from '@angular/router';

import { AppComponent } from './app.component';
import { DesignComponent } from './design/design.component';
import { FrontComponent } from './front/front.component';
import { AiComponent } from './design/ai/ai.component';
import { PsComponent } from './design/ps/ps.component';
import { StructComponent } from './front/struct/struct.component';
import { StyleComponent } from './front/style/style.component';
import { ScriptComponent } from './front/script/script.component';
import { JsComponent } from './front/script/js/js.component';
import { TsComponent } from './front/script/ts/ts.component';
import { HtmlComponent } from './front/struct/html/html.component';
import { JadeComponent } from './front/struct/jade/jade.component';
import { CssComponent } from './front/style/css/css.component';
import { LessComponent } from './front/style/less/less.component';
import { SassComponent } from './front/style/sass/sass.component';

const designRouter: Routes = [
  { path: '', redirectTo: 'DesignComponent', pathMatch: 'full' },
  { path: 'design', component: DesignComponent, children: [
      { path: 'ai', component: AiComponent },
      { path: 'ps', component: PsComponent }]
  },
  { path: 'front', component: FrontComponent, children: [
      { path: 'script', component: ScriptComponent, children: [
          { path: 'js', component: JsComponent },
          { path: 'ts', component: TsComponent }]
      },
      { path: 'struct', component: StructComponent, children: [
          { path: 'html', component: HtmlComponent },
          { path: 'jade', component: JadeComponent }]
      },
      { path: 'style', component: StyleComponent, children: [
          { path: 'css', component: CssComponent },
          { path: 'less', component: LessComponent },
          { path: 'sass', component: SassComponent }]
      }]
  }
];


@NgModule({
  declarations: [
    AppComponent,
    DesignComponent,
    FrontComponent,
    AiComponent,
    PsComponent,
    StructComponent,
    StyleComponent,
    ScriptComponent,
    JsComponent,
    TsComponent,
    HtmlComponent,
    JadeComponent,
    CssComponent,
    LessComponent,
    SassComponent
  ],
  imports: [
    BrowserModule,
    RouterModule.forRoot(designRouter)
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }
